<template>
	<div class="community-list-title">
		<span>历史战绩</span>
	</div>
	<div class="community-list-bottom">
		<commonGameRecordList :data="newData"></commonGameRecordList>
		<div v-if="newData.length === 0" class="no-data">
			<img src="../assets/image/noData.png">
			<p>暂无推荐</p>
		</div>
	</div>
</template>

<script lang="ts" setup>
	import commonGameRecordList from './commonGameRecordList.vue'
	import {cachLoading} from '../public/common.ts'
	import {
		ref,
		onMounted
	} from 'vue'
	import {
		HttpGetGameRecord,
	} from '../public/http'
	
	// 新闻
	let newData = ref([])
	let currentNewPage = ref(1)
	let isNewPage = ref(1)
	
	// 新闻列表
	const newMain = (page, type) => {
		if(cachLoading('getGameRecord')){
			newData.value = cachLoading('getGameRecord')
		}
		HttpGetGameRecord().then((res: any) => {
			if (res.code === 200) {
				cachLoading('getGameRecord',res.data)
				newData.value = res.data
			}
		})
	}
	onMounted(() => {
		newMain(1)
	})
</script>

<style lang="scss">
	.community-list-title {
		font-size: 15px;
		color: rgb(145, 149, 160);
		margin-right: 30px;
		cursor: pointer;
		height: 30px;
	}
	
	.community-list-bottom {
		width: 100%;
		height: calc(100% - 30px);
		overflow: auto;
	}
</style>
